<template>
	<scroll-view class="list-wrap-container full box" scroll-y @scrolltolower="initData(false)">
		<view class="order-item" v-for="(item,index) in list" :key="index">
			<order-item :record="item" @update="updateHandle" />
		</view>
		<view class="empty-wrapper" v-if="isEmpty">
			<u-empty text="暂无数据" :icon="sourceUrl + '/data-empty.png'" />
		</view>
		<view class="loadmore-wrapper" v-if="showLoading">
			<u-loadmore icon-color="#3c9cff" :status="status" loading-icon="semicircle" />
		</view>
	</scroll-view>
</template>

<script>
	import OrderItem from './order-item.vue'
	import { LOAD_MORE } from '@/constant/index.js'
	export default {
		props: ['type', 'auto'],
		components: { OrderItem },
		methods: {
			updateHandle(ev) {
				this.initData(true)
			},
			generageList(list) {
				return list.map(item => {
					const { userInfo, lineInfo, status, order_price, edit_price } = item
					const { avatar, nickname } = userInfo
					const { line_name, cover_image, id, } = lineInfo
					delete item.userInfo
					delete item.lineInfo
					const statusEnum = {
						'1': '待付款',
						'2': '待出行',
						'3': '待评论',
						'4': '退款成功',
						'5': '订单已取消',
						'6': '已完成',
						'7': '退款中'
					}
					const showPrice = edit_price * 1 > 0 ? edit_price : order_price
					return {
						...item,
						showPrice,
						userAvatar: avatar,
						nickname,
						lineName: line_name,
						lineImage: cover_image,
						lineId: id,
						statusText: statusEnum[status]
					}
				})
			},
			async initData(clear = false, cb) {
				if (clear) {
					this.page = 1
					this.status = LOAD_MORE.LOADING
					this.list = []
					this.isEmpty = false
					this.hasInit = false
				}
				if (!!cb) {
					this.showLoading = false
				}
				if (this.status === LOAD_MORE.NO_MORE) return
				this.status = LOAD_MORE.LOADING
				const { page, pageSize, type } = this
				const resp = await this.$request({
					url: "/Order/getOrderList",
					data: { status: type, page, list_rows: pageSize },
				})
				await this.$delay(300)
				const { code, data, msg } = resp
				if (code !== 1) {
					this.status = LOAD_MORE.LOAD_MORE
					return this.$toast({ title: msg })
				}
				if (!data.data) data.data = []
				const { data: list, current_page, per_page, total } = data
				this.list.push(...this.generageList(list.filter(item => !!item.lineInfo)))
				this.hasInit = true
				this.isEmpty = this.list.length === 0
				const hasMore = current_page * per_page < total
				cb && cb(hasMore)
				this.showLoading = true
				if (hasMore) {
					this.page += 1
					return this.status = LOAD_MORE.LOAD_MORE
				}
				this.status = LOAD_MORE.NO_MORE
			},
		},
		data() {
			return {
				page: 1,
				list: [],
				isEmpty: false,
				status: LOAD_MORE.LOAD_MORE,
				pageSize: 15,
				hasInit: false,
				showLoading: true,
			}
		}
	}
</script>

<style lang="scss" scoped>
	.list-wrap-container {
		.order-item {
			margin-bottom: 16rpx;

			&:last-child {
				margin-bottom: 0;
			}
		}
	}
</style>